var btn = document.getElementsByClassName('btn')[0]
btn.onclick = function () {

    location.href = './search.html'
}



var log = document.getElementsByClassName('log')[0]
var reg = document.getElementsByClassName('reg')[0]
var emptycar = document.getElementsByClassName('emptycar')[0]
var goodslist = document.getElementsByClassName('goodslist')[0]
var wrap = document.getElementsByClassName('wrap')[0]
var lgc = getCookie('lgc')
if (lgc) {
    log.innerHTML = lgc
    reg.innerHTML = '退出登录'
    reg.onclick = function () {
        delCookie('lgc')
        location.reload()
        log.innerHTML = `<a href="./login.html?ReturnUrl=./details.html">请登录</a>`
        reg.innerHTML = `<a href="./register.html">注册有礼</a>`
    }
    searchShoppingCarByUser({ user: lgc }).then(res => {
        var { status, list } = res
        if (status) {
            if (list.length > 0) {
                var goodsHtml = ``
                list.forEach(res => {
                    var { buyNum, goodsName, goodsImg, goodsPrice, id } = res
                    goodsHtml += `
                <div class="onegoodlist">
                    <div class="checkbox"><input class="check-one check" type="checkbox" /></div>
                    <div class="goods">
                        <img src="${goodsImg}" alt="">
                        <span>${goodsName}</span>
                    </div>
                    <div class="price">${Number(goodsPrice)}</div>
                    <div class="count">
                        <span class="reduce">${buyNum > 1 ? '-' : ''}</span>
                        <input class="count-input" name="${id}" type="text" value="${buyNum}">
                        <span class="add">+</span>
                    </div>
                    <div class="subtotal">${buyNum * Number(goodsPrice)}</div>
                    <div class="operation"><span class="delete">删除</span></div>
                </div>
                    `
                })
                var goodslist = document.getElementsByClassName('goodslist')[0]
                goodslist.innerHTML = goodsHtml

                var checkAll = document.getElementsByClassName('AllCheckBox')[0]
                var checkList = Array.from(document.getElementsByClassName('check-one'))

                var addList = Array.from(document.getElementsByClassName('add'))
                var reduceList = Array.from(document.getElementsByClassName('reduce'))

                var deleteList = Array.from(document.getElementsByClassName('delete'))
                var deleteAll = document.getElementsByClassName('deleteAll')[0]
                var selAll = document.getElementsByClassName('selectedTotal')[0]
                var priceTotal = document.getElementsByClassName('priceTotal')[0]

                //全选反选
                //单点全选-对单选框进行修改
                checkAll.onclick = function () {
                    //循环遍历让单选框跟全选框状态一样
                    for (let i = 0; i < checkList.length; i++) {
                        checkList[i].checked = checkAll.checked
                    }
                    getAll()//计算总计的数量和价格//计算总计的数量和价格
                }
                //循环遍历单选框，如果全部选中则全选为true，否则为false
                var checkList = Array.from(document.getElementsByClassName('check-one'))
                checkList.forEach(function (check) {
                    check.onclick = function () {
                        getAll()//计算总计的数量和价格
                        checkAll.checked = checkList.every(function (check) {
                            return check.checked == true
                        })
                    }
                })
                //加号绑定事件
                addList.forEach(function (add) {
                    add.onclick = function () {
                        var val = add.previousElementSibling.value //取值
                        val++//改值
                        add.previousElementSibling.value = val//赋值
                        //获取当前商品的价格
                        var price = add.parentElement.previousElementSibling.innerHTML
                        //计算小计并赋值
                        add.parentElement.nextElementSibling.innerHTML = (val * price).toFixed(2)
                        add.previousElementSibling.previousElementSibling.innerHTML = '-'
                        getAll()//计算总计的数量和价格
                        var id = add.previousElementSibling.name
                        updateShoppingCarById({ id, type: 2, buyNum: val })
                    }
                })
                //减号绑定事件
                reduceList.forEach(function (reduce) {
                    reduce.onclick = function () {
                        var val = reduce.nextElementSibling.value //取值
                        //如果数量减少到一的话，则提醒不能减少，删除'-'号并return出去不执行下面改值的操作
                        if (val <= 1) {
                            alert('亲，实在是不能在少了哦！')
                            return
                        }
                        val--//改值
                        if (val == 1) {
                            reduce.innerHTML = ''
                        }
                        reduce.nextElementSibling.value = val//赋值
                        //获取当前商品的价格
                        var price = reduce.parentElement.previousElementSibling.innerHTML
                        //计算小计并赋值
                        reduce.parentElement.nextElementSibling.innerHTML = (val * price).toFixed(2)
                        getAll()//计算总计的数量和价格
                        var id = reduce.nextElementSibling.name
                        updateShoppingCarById({ id, type: 2, buyNum: val })
                    }
                })
                //单删全删的绑定判断
                //单删
                deleteList.forEach(function (del) {
                    del.onclick = function () {
                        var id = this.parentElement.parentElement.getElementsByClassName('count-input')[0].name
                        deleteShoppingCarById({ id })
                        del.parentElement.parentElement.remove()
                        var checkList = Array.from(document.getElementsByClassName('check-one'))
                        checkAll.checked = checkList.every(function (check) {
                            return check.checked == true
                        })
                        checkdel()//判断删除之后全选状态
                        getAll()//计算总计的数量和价格

                    }
                })
                //全删
                deleteAll.onclick = function () {
                    var idstr = ''
                    checkList.forEach(function (check) {
                        if (check.checked) {
                            idstr += check.parentElement.parentElement.getElementsByClassName('count-input')[0].name + ','
                            check.parentElement.parentElement.remove()
                        }
                    })

                    idstr = idstr.substring(0, idstr.length - 1)
                    deleteShoppingCarById({ id: idstr })
                    checkdel()//判断删除之后全选状态
                    getAll()//计算总计的数量和价格
                }
                //判断删除之后全选状态
                function checkdel() {
                    var checkList = Array.from(document.getElementsByClassName('check-one'))
                    if (checkList.length == 0) {
                        checkAll.checked = false
                    }
                }
                //结算
                function getAll() {
                    var allNum = 0
                    var allPrice = 0
                    var checkList = Array.from(document.getElementsByClassName('check-one'))
                    checkList.forEach(function (check) {
                        if (check.checked) {
                            var thisNum = check.parentElement.nextElementSibling.nextElementSibling.nextElementSibling.firstElementChild.nextElementSibling.value * 1
                            var thisPrice = check.parentElement.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.innerHTML * 1
                            allNum += thisNum
                            allPrice += thisPrice
                        }
                    })
                    selAll.innerHTML = `已选商品 <span>${allNum}</span>件`
                    priceTotal.innerHTML = `合计: <span>￥${allPrice.toFixed(2)}</span>`
                }
            } else {
                wrap.style.display = 'none'
                emptycar.style.display = 'block'
                emptycar.innerHTML = `
                <img src="../IMAGES/shoppingCar.png" alt="">
                <div class="emptycar-info">
                <div>亲,购物车还是空空的呢~
                </div>
                <span>您可以<a href="./index.html">去逛逛哦~</a></span>
        </div>
                `
            }
        }
    })
} else {
    emptycar.style.display = 'block'
    wrap.style.display = 'none'
}